<template>
	<div class="scrollEl">
    <div class="content recommend" v-if="pageId === 0">
      <Recommend/>
    </div>
    <div class="content internalPrice" v-if="pageId === 1">
      1
    </div>
    <div class="content buyAgain" v-if="pageId === 2">
      2
    </div>
    <div class="content shareOrder" v-if="pageId === 3">
      3
    </div>
    <div class="content devLogs" v-if="pageId === 4">
      4
    </div>
    <div class="content talentedMan" v-if="pageId === 5">
      5
    </div>
    <div class="content newGoods" v-if="pageId === 6">
      6
    </div>
    <div class="content home" v-if="pageId === 7">
      7
    </div>
  </div>
</template>

<script>
  import Recommend from './recommend'
  export default {
    name: 'index',
    computed:{
      pageId(){
        return this.$route.params.id
      },
    },
    components:{
      Recommend
    }
  }
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
  .content
    background #F4F4F4
    &.recommend
      zoom 1
      .contentWrap
        display flex
        flex-direction column
        justify-content space-evenly
        .style1
          height 336px
          background: #fff
          margin 20px 0
          padding 32px 30px
          box-sizing border-box
          display flex
          justify-content space-between
          .info
            display flex
            flex-direction column
            justify-content space-between
            .userName
              .avatar
                width 54px
                height 54px
                border-radius 50%
                display inline-block
                vertical-align middle
              span
                font-size 28px
                font-family "Microsoft YaHei UI"
            .title
              width 400px
              height 118px
              font-size 36px
            .desc
              color #7F7F7F
              font-size 28px
            .views
              color #999
              font-size 22px
          img
            width 272px
            height 272px
        .style2
          .title
            width 690px
            height 102px
          img
            width 100%
            height auto
          .views
            color #999
            font-size 22px
    &.internalPrice
      zoom 1
    &.buyAgain
      zoom 1
    &.shareOrder
      zoom 1
    &.devLogs
      zoom 1
    &.talentedMan
      zoom 1
    &.newGoods
      zoom 1
    &.home
      zoom 1
</style>
























